<!DOCTYPE html>
<HTML>
<HEAD>
    <?= $this->render("label/tpl1-header.phtml"); ?>
	<title>Step 5</title>
</HEAD>
<BODY>
  <div class="content">
    <div class="car-wrap" style="height:430px;">
      <h1>Photos and specifications</h1>
	  <form method="post" onSubmit="return _CAR.validateStep5();" enctype="multipart/form-data">
	    <input type="hidden" name="step" value="6">
	    <input type="hidden" name="reg" value="<?= $_POST['reg'] ?>" >
	    <input type="hidden" name="prev_data" value="<?= $this->prev_data ?>" >
	    <div class="step5-details-left"> 
	      <div class="more-car-details">
		    <label>Body work condition</label>
			<div class="condition-picker">

				<img width="363" height="225" class="fleft rhtmar2" src="/img/map_car.png" border="0" usemap="#Map"/>

				<map name="Map" id="Map3">
				  <area class="showTip L5" onclick="return _CAR.conditionShowTable('5');" href="javascript:;" shape="poly" coords="112,157,112,195,100,184,90,176,77,175,69,179,63,185,57,195,55,200,42,199,29,199,22,195,22,189,28,188,40,179,38,183,39,152" alt="">
				  <area class="showTip L7" onclick="return _CAR.conditionShowTable('7');" href="javascript:;" shape="poly" coords="24,21,53,23,56,27,62,38,79,49,97,45,111,29,112,64,75,63,47,67,39,76,36,35,20,32" alt="">
				  <area class="showTip L27" onclick="return _CAR.conditionShowTable('27');" href="javascript:;" shape="poly" coords="341,193,357,188,362,153,361,147,363,137,362,127,361,121,363,108,363,101,362,89,362,76,363,67,361,59,361,54,358,40,354,33,342,30,342,36,342,33,347,32,348,39,350,45,352,54,355,65,355,71,354,77,354,86,353,94,354,99,353,106,353,115,352,122,353,129,354,134,353,140,352,150,351,157,352,169" alt="">
				  <area class="showTip L1" onclick="return _CAR.conditionShowTable('1');" href="javascript:;" shape="poly" coords="1,166,2,144,3,136,2,126,1,115,-1,103,2,85,0,92,3,61,6,49,6,39,10,31,13,25,18,22,24,21,19,26,12,53,9,93,8,111,8,116,8,121,8,128,10,136,9,145,11,166,23,201,11,198" alt="Bumper">
				  <area class="showTip L4" onclick="return _CAR.conditionShowTable('4');" href="javascript:;" shape="circle" coords="83,201,24" alt="">
				  <area class="showTip L19" onclick="return _CAR.conditionShowTable('19');" href="javascript:;" shape="circle" coords="277,201,23" alt="">
				  <area href="#" shape="poly" coords="105,64">
				  <area href="#" shape="poly" coords="105,64">
				  <area href="#" shape="poly" coords="23,200">
				  <area class="showTip L8" onclick="return _CAR.conditionShowTable('8');" href="javascript:;" shape="circle" coords="84,22,24" alt="">
				  <area class="showTip L11" onclick="return _CAR.conditionShowTable('11');" href="javascript:;" shape="poly" coords="114,64,110,107,111,134,114,153,115,159,134,145,134,78" alt="">
				  <area class="showTip L10" onclick="return _CAR.conditionShowTable('10');" href="javascript:;" shape="poly" coords="112,165,140,147,178,147,177,165,113,165" alt="">
				  <area class="showTip L9" onclick="return _CAR.conditionShowTable('9');" href="javascript:;" shape="poly" coords="112,190,111,166,177,166,178,195,116,195,112,191" alt="">
				  <area class="showTip L15" onclick="return _CAR.conditionShowTable('15');" href="javascript:;" shape="poly" coords="181,147,181,165,245,165,219,146,182,147" alt="">
				  <area class="showTip L14" onclick="return _CAR.conditionShowTable('14');" href="javascript:;" shape="poly" coords="181,194,245,195,248,190,247,165,181,166,181,193" alt="">
				  <area class="showTip L12" onclick="return _CAR.conditionShowTable('12');" href="javascript:;" shape="poly" coords="114,57,139,75,178,75,178,57,115,56" alt="">
				  <area class="showTip L13" onclick="return _CAR.conditionShowTable('13');" href="javascript:;" shape="poly" coords="111,30,111,56,177,56,178,28,111,28" alt="">
				  <area class="showTip L17" onclick="return _CAR.conditionShowTable('17');" href="javascript:;" shape="poly" coords="182,57,246,57,220,75,182,75,183,58,182,59" alt="">
				  <area class="showTip L18" onclick="return _CAR.conditionShowTable('18');" href="javascript:;" shape="poly" coords="180,28,181,56,247,56,247,32,240,27,181,27" alt="">
				  <area class="showTip L23" onclick="return _CAR.conditionShowTable('23');" href="javascript:;" shape="circle" coords="278,22,23" alt="">
				  <area class="showTip L6" onclick="return _CAR.conditionShowTable('6');" href="javascript:;" shape="poly" coords="43,75,42,145,50,153,107,155,107,63,56,66,44,72" alt="">
				  <area class="showTip L21" onclick="return _CAR.conditionShowTable('21');" href="javascript:;" shape="poly" coords="242,79,242,145,263,157,263,68,242,79" alt="">
				  <area class="showTip L24" onclick="return _CAR.conditionShowTable('24');" href="javascript:;" shape="poly" coords="270,65,270,158,313,152,320,145,320,79,313,70,272,65" alt="">
				  <area href="#" shape="poly" coords="15,200">
				  <area class="showTip L25" onclick="return _CAR.conditionShowTable('25');" href="javascript:;" shape="poly" coords="335,145,344,146,344,170,343,176,339,179,334,180,330,178,329,173,332,168" alt="">
				  <area class="showTip L26" onclick="return _CAR.conditionShowTable('26');" href="javascript:;" shape="poly" coords="336,74,342,74,344,48,338,41,332,41,329,45" alt="">
				  <area class="showTip L3" onclick="return _CAR.conditionShowTable('3');" href="javascript:;" shape="poly" coords="17,42,17,95,37,95,37,49,32,41,25,39,17,41" alt="">
				  <area class="showTip L2" onclick="return _CAR.conditionShowTable('2');" href="javascript:;" shape="poly" coords="35,131,36,176,33,182,28,185,24,187,20,186,16,185,15,161,15,140,15,130,33,130" alt="">
				  <area href="#" shape="poly" coords="136,78">
				  <area class="showTip L22" onclick="return _CAR.conditionShowTable('22');" href="javascript:;" shape="poly" coords="248,38,245,70,257,69,267,61,278,62,300,64,312,66,322,75,328,69,330,57,325,45,340,31,318,28,299,34,297,43,283,47,271,47,256,44,249,35,247,38" alt="">
				  <area class="showTip L20" onclick="return _CAR.conditionShowTable('20');" href="javascript:;" shape="poly" coords="242,149,239,157,249,166,251,179,250,189,260,179,274,176,287,176,298,184,308,193,318,194,339,193,339,186,328,179,323,172,330,168,333,156,330,141,322,145,319,153,307,157,286,159,276,162,268,162,257,159,248,154,242,151" alt="">
				  <area class="showTip L16" onclick="return _CAR.conditionShowTable('16');" href="javascript:;" shape="poly" coords="137,80,137,145,216,143,238,147,239,74,136,78" alt="">
                </map>                 
			</div>
		  </div>
	    </div>
	    <div class="step5-details-mid">
	      <div class="more-car-details">
   			<?= $this->render('/label/tpl1-condition-elements.phtml'); ?>
	      </div>
	    </div>
	    <div class="step5-details-right">
	      <div class="more-car-details">
  			<label>Condition Summary List</label>
			<div id="summary-list"></div>
	      </div>
	    </div>
		<div class="clear"></div>
	    <div class="two-col"> 
	      <div class="more-car-details">
	        <label>Mechanical Condition:</label>
		     <label class="radio_elem"><input type="radio" value="Good" name="mechanical_condition"> Good </label> 
		     <label class="radio_elem"><input type="radio" value="Average" name="mechanical_condition"> Average  </label>
		     <label class="radio_elem"><input type="radio" value="Poor" name="mechanical_condition"> Poor</label>
		     <label class="radio_elem"><input type="radio" value="Non-Runner" name="mechanical_condition"> Non-Runner </label>
		  </div>
		</div>
	    <div class="two-col"> 
	      <div class="more-car-details">
	        <label>Interior Condition:</label>
			<label class="radio_elem"><input type="radio" value="Good" name="interior_condition"> Good </label>
			<label class="radio_elem"><input type="radio" value="Average" name="interior_condition"> Average </label><br >
			<label class="radio_elem"><input type="radio" value="Poor" name="interior_condition"> Poor </label>
		  </div>
		</div>
		<div class="clear"></div>

		

		<div style="display:block; float:right">
	      <input type="submit" value="Continue" class="continue-button" style="margin-right:30px;">
		</div>
	  </form>
    </div>
  </div>
</BODY>
</HTML>


